<template>	

		<z-paging ref="paging" 
			:fixed="false" 
			:paging-style="{
				height: $device.measure.windowHeight - 48 - 49  + 'px',
				backgroundColor: '#f0f0f0'
			}" 
			v-model="tasks" 
		>
			
			<u-sticky v-show="currentTabIndex == 0" :offsetTop="0" :customNavHeight="0">
				<!-- 日历滚动条 -->
				<job-calendar @change="onCalendarTap">
					<template #text="{index}">
						{{itineraryText(index)}}
					</template>
				</job-calendar>
			</u-sticky>
			
<!-- 		<view v-if="tasks.length < 1" style="background-color: white;padding-top: 80px;">
				<u-empty
						mode="list"
						:icon="absUrl('/static/empty-list.jpg')"
						text="今日没有任务哦"
				>
				</u-empty>
				
				<view style="margin: 50px;">
					<u-button> 提交新任务 </u-button>
				</view>
			</view> -->
			
			<!-- 什么鬼 -->
			<view v-for="(task,index0) in tasks" style="margin: 5px 5px 5px 5px;background-color: #fefefe;border-radius: 20rpx;position: relative;box-shadow: 0px 0px 13px 0px #99999945;">
				<view style="border-bottom: solid 1rpx #eee;padding: 2rpx 20rpx;">
					<view style="display: flex;justify-content: space-between;margin: 15rpx 15rpx;">
						<text style="font-size: 16px;font-weight: bold;display: flex;align-items: center;">{{task.title}}</text>
						<text style="font-size: 15px;margin-right: 5px;">{{$dayjs(task.start_date).fromNow()}}</text>
						<view>顺德.乐从</view>
					</view>
					<view style="display:flex;justify-content: space-between;align-items: center;">
						<view style="display: flex;justify-content: flex-start;margin: 15rpx 15rpx;">
							<text style="margin-right: 5rpx;padding: 2rpx 8rpx;font-size: 12px;display: flex;align-items: center;color: white;background-color:#ff6a00;border-radius: 10rpx;">
								自有(已众招)
							</text>
							
							<text style="margin-right: 5rpx;padding: 2rpx 8rpx;font-size: 12px;display: flex;align-items: center;color: white;background-color:#ff6a00;border-radius: 10rpx;">
								众招项目
							</text>
						</view>
						 
						<!-- 工资 -->
						<view style="font-weight: bold;color: #f00;font-size: 13px;white-space: nowrap;justify-self: flex-end;">
							<span>{{task.jobs[0].price}}元/{{task.jobs[0].price_type}}</span>
							<span>/{{task.jobs[0].settle_type}}</span>
						</view>
					</view>
				</view>
						
				<view style="display:flex;flex-direction: column;padding:5px 10px;position: relative;">
					<view style="color:#999;padding-right: 10px;flex:1 1 0;display: flex;justify-content: space-between;align-items: center;padding:5px">
						<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
							<view style="font-size: 18px;font-weight: bold;color: #000">18</view>
							<view style="padding: 5px 0;font-size: 12px">需求</view>
						</view>
						<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
							<view style="font-size: 18px;font-weight: bold;color: #000">{{task.enrolls_count}}</view>
							<view style="padding: 5px 0;font-size: 12px">报名</view>
						</view>
						<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
							<view style="font-size: 18px;font-weight: bold;color: #000">{{task.comfirm_count}}</view>
							<view style="padding: 5px 0;font-size: 12px">确认</view>
						</view>
						<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
							<view style="font-size: 18px;font-weight: bold;color: #000">{{task.sign_up_count}}</view>
							<view style="padding: 5px 0;font-size: 12px">签到</view>
						</view>
						<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
							<view style="font-size: 18px;font-weight: bold;color: #000">{{task.sign_down_count}}</view>
							<view style="padding: 5px 0;font-size: 12px">签退</view>
						</view>
						<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
							<view style="font-size: 18px;font-weight: bold;color: #000">{{task.sign_down_count}}</view>
							<view style="padding: 5px 0;font-size: 12px">验收</view>
						</view>
						<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
							<view style="font-size: 18px;font-weight: bold;color: #000">{{task.sign_down_count}}</view>
							<view style="padding: 5px 0;font-size: 12px">发薪</view>
						</view>
					</view>
					<view style="height: 1px;background-color: #902eff;width: 30%;position: absolute;bottom: 0;left: 0;"></view>
				</view>
				
<!-- 					<view>
					<jobCard :task="task"></jobCard>
				</view> -->
				
				<view  class="bottom_line" v-for="(formData,index) in task.jobs" style="display: flex;justify-content: space-between;align-items:center;line-height: 12px;padding: 0px 0px;">
					<!-- 内容区域 -->
					<view style="flex: 1 0 0%;display: flex;flex-direction: column;padding: 2px;">
						<view style="padding: 8px;display: flex;justify-content: space-between;align-items: center;flex-wrap: nowrap;">		
							<!-- 职位名称 -->
							<view style="flex: 1 1 55%;display: flex;justify-content: space-between;">
								<view style="font-size: 13px;font-weight: bold;white-space: nowrap;"><text>{{formData.name}}</text></view>
							</view>
							<!-- 人数 -->
							<span style="font-size: 12px;color: #9c9c9c;padding-left: 5px;white-space: nowrap;">1/{{formData.num}}人</span>
							
							<!-- 时间 -->
							<view style="flex:0 0 45%;text-align: right;color:#757575">
								<view style="line-height: 13px;font-size: 13px;font-weight: bold;white-space: nowrap;"><text>{{fixedTime(formData.start_time)}}-{{fixedTime(formData.end_time)}}</text></view>
							</view>
						</view>
					</view>
				</view>
				
				<view style="display: flex;justify-content: space-between;border-top: solid 0.03125rem #eee;padding: 10px 10px;">
					
						<view @click="showPromotion(task)" style="display: flex;align-items: center;padding: 5px 10px;height: 30px;background-color: #902eff;color: #ff9d00;border-radius: 10rpx;box-shadow: 0px 0px 13px 0px #902eff55;">
							<u-icon name="share-square" color="white"></u-icon>
							<span style="font-size: 24rpx;padding-left:3px;color:white">职位推广</span>
						</view>
					
					<view @click="onOrganize(task)" style="border: solid 1rpx #eee;justify-content: center;align-items:center;display: flex;padding: 5px 10px;height: 30px;border-radius: 5px;box-shadow: 0px 0px 13px 0px #99999945;">
						 <i class="iconfont icon-zuzhiguanli" style="margin: 5px;color: #ff6a00;"></i>
						 <view style="color:#ff8d01;">
							 活动管理
						</view>
					</view>
				</view>
			</view>	
		</z-paging>

			<!-- 列表衬底 -->
			<!-- <view style="height: 55px;"></view> -->
</template>

<script>
	import jobCard from '@/components/job-card/job-card.vue'
	import timeTextFormat from '@/utils/mixins/time-text-format.js'
	import workData from '@/utils/data/workData.js'
	import {LRUCache} from 'lru-cache'
	let cache = new LRUCache({max:10,ttl:5000})
	
	export default {
		components:{
			// jobCalendar
			jobCard
		},
		mixins:[
			timeTextFormat,workData
		],
		data() {
			return {
				currentTabIndex:0,
				calendarIndex:0,
				calendarDate:this.$dayjs().format('YYYY-MM-DD'),
				isNoMore:false,
				nextPage:1,
				//itinerary:[],
				tasks:[],
				doingProjects:[],
				AllProjects:[],
				list2: [
					{
						name: '日程',
					},
					{
						name: '执行中',
					}, {
						name: '已完结'
					}, {
						name: '已取消'
					},
				]
			}
		},
		computed:{
			currentProjects(){
				return (index)=>{
					switch (index){
						case 0:
							return this.tasks
						case 1:
							return this.doingProjects
						
					}
				}
			}
		},
		async mounted() { 
			let res = await this.$http.get('/manager/job/task/itinerary',{
				cache:this.$cache30s
			})
			 
			console.log(res.data)
			this.itinerary = res.data.itinerary
			
			console.log(this.itinerary)
			
			if(this.itinerary.length == 0)
				return
				
			this.updateDay(0,this.itinerary[0].start_date)
		},
		methods: { 
			onCalendarTap(i,date){
				
				if(i == this.calendarIndex) return 
				
				this.calendarIndex = i
				this.calendarDate = date
				this.tasks = []
				this.nextPage = 1
				this.isNoMore = false
				this.updateDay()
			},
			async updateDay(page,size){
				let that = this
				
				// if(this.isNoMore)  return true
				
				uni.showLoading({
					title:'正在加载'
				})
				
				let res = await this.$http.get(`/manager/job/task/list/date?start_date=${this.calendarDate}&page=${this.nextPage}&size=${size}`,{
					cache:this.$cache30s
				})
				
				//console.log(res.data.data)
				// if(res.data.data.length > 0)
				// {
					this.$refs.paging.complete(res.data.data)
				// }else
				// {
				// 	uni.showToast({
				// 		title:'没有更多了',
				// 		icon:'none',
				// 		duration:800
				// 	})
					
				// 	that.isNoMore = true
				// }
				
				uni.hideLoading()
			},
			onOrganize(task){
				console.log(task)
				this.pageParam.project_organize = task
				
				uni.navigateTo({
					url:'/pages/job/publish/job-organize/job-organize'
				})
			},
			onEnrollShare(){
				// uni.navigateTo({
				// 	url:"/pages/enter/user-enroll/user-enroll"
				// })
			},			
			addJobProject(){
				console.log(this.user.name)
			},
		}
	}
</script>

<style scoped>
	
</style>
